<template>
  <view>
    <view class="nav">
      <view class="iconfont icon-xiangzuo" @click="back"></view>
      <text>公司详情</text>
      <view></view>
    </view>
    <!-- <view class="bottom">
      <view class="item" @click="signUp">
        <view class="iconfont icon-wyzp"></view>
        <text>报名</text>
      </view>
      <view :class="['item',{'color-primary':collection}]" @click="collect">
        <view :class="['iconfont',collection?'icon-shoucang1':'icon-shoucang']"></view>
        <text>{{collection?'已':''}}收藏</text>
      </view>
      <button class="connect" @click="connect" open-type="contact">
        立即沟通
      </button>
    </view > -->
    <view class="title">
      <view>{{detail.name}}</view>
      <!-- <text>{{item.salary}}</text> -->
      <!-- <text>10k-15k</text> -->
    </view>
    <view class="condition">
      <view class="iconfont icon-weizhi">
        <!-- <text>{{detail.city}}·{{item.district}}·{{item.address}}</text> -->
        <!-- <text>{{detail.site}}</text> -->
      </view>
      <!-- <view class="iconfont icon-work">
        <text>{{detail.scale}}</text>
      </view> -->
      <view class="iconfont icon-xueli">
        <text>{{detail.type}}</text>
        <!-- <text>普本</text> -->
      </view>
    </view>
    <view class="bo">
      <view class="bo-info">
        <!-- <view class="pic">
          <image :src="detail.logo"></image>
        </view> -->
        <view class="info">
          <view class="name">
            <!-- {{detail.corporateRepresentative}}<text>刚刚活跃</text> -->
			经营范围
          </view>
          <view class="company">
            {{detail.scope}}
          </view>
        </view>
      </view>
      <!-- <view class="iconfont icon-right"></view> -->
    </view>
    <view class="detail">
      <view class="detail-title">
        公司简介
      </view>
      <!-- <view class="tags">
        <view class="tag" v-for="(items,index) in item.tags.split(',')" :key="index">{{items}}</view>
      </view> -->
      <view class="text-desc">
		<view v-if='detail.intro' v-html='detail.intro'></view>
		<view v-else>暂无</view>
      </view>
    </view>
    <!-- <view class="bo border-bottom-none" @click="companyClick">
      <view class="bo-info">
        <view class="pic">
          <image src="../../static/uni.png"></image>
        </view>
        <view class="info">
          <view class="name normal">
            廊坊新创科技有限公司
          </view>
          <view class="company">
            科技开发·未融资·20-99人
          </view>
        </view>
      </view>
      <view class="iconfont icon-right"></view>
    </view> -->
    <!-- <view class="map">
       :markers="covers"
      <map style="width: 100%;height:100%" :latitude="map.latitude" :longitude="map.longitude" scale="11"  />
    </view> -->
    <view class="tips">
      <view class="iconfont icon-safe">
        <text>安全提示</text>
      </view>
      <view class="item">
        ·严禁用人单位做出任何损害求职者合法权益的违法违规行为，包括但不限于扣押求职者证件、收集求职者财物、向求职者集资、让求职者入股、诱导求职者异地入职、异地参加培训等，您一旦发现此类行为，<text
          class="report">请立即举报</text></view>
      <view class="item" @click="xxx">·了解更多职场安全防范知识<text class="iconfont icon-right"></text></view>
    </view>
    <!-- <view class="others">
      <view class="til">
        该公司其他岗位
      </view>
      <work-item v-for="item in jobList" :key="item.job_id" :item="item">
        <view class="line"></view>
      </work-item>
    </view> -->
  </view>
</template>

<script>
  export default {
    data() {
      return {
        // 接收从position传过来的
        item: {
			tags: 'python,java,js,node'
		},
        // 接收请求过来得数据
        detail: {},
        collection: false,
        jobList:[],
        offset:0,
		map: {
			latitude:23.106574, //纬度
			longitude:113.324587,//经
		}
      }
    },
    onLoad(options) {
		const {id} = options;
		this.getDetailData(id);
    },
    methods: {
		getDetailData(id) {
			this.$api.companyDetail(id).then(res=>{
				console.log(res)
				if(res.code === 200) {
					this.detail = res.data;
				}
			})
		},
		xxx() {
			console.log(this.detail)
		},
		back() {
			uni.navigateBack()
		},
    }
  }
</script>

<style lang="scss">
  page {
    width: 680rpx;
    // 84
    // padding: 0 35rpx 180rpx;
    // padding-bottom: 180rpx;
  }

  .nav {
    width: 680rpx;
    padding: 58rpx 0 0;
    height: 92rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 34rpx;
    font-weight: bold;
    position: fixed;
    top: var(--window-top);
    z-index: 10;
    background: #FFF;
    .iconfont {
      height: 92rpx;
      line-height: 92rpx;
      // padding-right: 20rpx;
    }
  }

  .title {
    width: 680rpx;
    padding: 200rpx 0 0;
    display: flex;
    justify-content: space-between;
    align-content: center;
    font-weight: bold;

    view {
      font-size: 40rpx;
	  line-height: 50rpx;
      // max-width: 380rpx;
    }

    text {
      font-size: 30rpx;
      color: $uni-color-primary;
      display: flex;
      align-items: center;
    }
  }

  .condition {
    display: flex;
    flex-wrap: wrap;
    margin-top: 20rpx;
    padding: 0 0;

    .iconfont {
	  display: flex;
      margin-right: 40rpx;
      color: $uni-text-color;

      text {
        margin-left: 10rpx;
        font-size: 28rpx;
      }
    }
  }

  .bo {
    width: 680rpx;
    height: auto;
    margin-top: 50rpx;
    border-top: 1rpx solid #F1F1F1;
    border-bottom: 1rpx solid #F1F1F1;
    display: flex;
    padding: 0 0;
    justify-content: space-between;
    align-items: center;

    .bo-info {
      display: flex;
	margin-top: 20px;
      .pic {
        margin-right: 30rpx;
        width: 98rpx;
        height: 98rpx;
        border-radius: 50%;

        image {
          width: 98rpx;
          height: 98rpx;
          border-radius: 50%;
        }
      }

      .info {
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;

        .name {
          font-size: 32rpx;
          font-weight: bold;

          text {
            font-size: 22rpx;
            color: $uni-text-color-grey;
            margin-left: 20rpx;
          }
        }

        .normal {
          font-weight: normal;
        }

        .company {
          font-size: 28rpx;
        }
      }
    }

    .iconfont {
      color: $uni-text-color-grey;
    }
  }

  .detail {
    width: 680rpx;
    padding: 0 0;
    margin-top: 52rpx;

    .detail-title {
      font-size: 32rpx;
      font-weight: bold;
    }

    .tags {
      display: flex;
      flex-wrap: wrap;
      margin-top: 34rpx;

      .tag {
        margin-right: 16rpx;
        background-color: $uni-bg-color-grey;
        color: #666;
        padding: 0 20rpx;
        font-size: 28rpx;
        margin-bottom: 20rpx;
      }
    }

    .text-desc {
		margin-top:20rpx;
		font-size: 28rpx;
		color: #666;
    }
  }

  .map {
    width: 680rpx;
    height: 456rpx;
    // margin-left: 35rpx;
    background: grey;
    border-radius: 20rpx;
  }

  .border-bottom-none {
    border-bottom: none;
  }

  .tips {
    width: 680rpx;
    margin-top: 50rpx;
    padding: 55rpx 0;
    border-top: 1rpx solid #F1F1F1;
    border-bottom: 1rpx solid #F1F1F1;

    .iconfont {
      font-weight: bold;
      font-size: 30rpx;
      color: #558EF7;
      margin-bottom: 10rpx;

      text {
        color: #000;
        margin-left: 10rpx;
      }
    }

    .item {
      color: #666;
      font-size: 26rpx;
      margin-top: 10rpx;
      text-indent: -30rpx;
      padding-left: 30rpx;

      .iconfont {
        color: $uni-text-color-grey;
        font-size: 26rpx;
        margin-left: 20rpx;
      }

      .report {
        color: #5888CF;
        text-decoration: underline;
      }
    }
  }
  .bottom {
    width: 680rpx;
    height: 142rpx;
    padding: 0 35rpx;
    border-top: 1rpx solid #F1F1F1;
    background: #fff;
    position: fixed;
    bottom: var(--window-bottom);
    left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;

    .connect {
      width: 492rpx;
      height: 84rpx;
      background: $uni-primary;
      border-radius: 20rpx;
      color: $uni-text-color-inverse;
      line-height: 84rpx;
      text-align: center;
    }
    .color-primary {
      color: $uni-primary;
    }

    .item {
      text-align: center;

      .iconfont {
        height: 32rpx;
        line-height: 32rpx;
      }

      .icon-share {
        font-size: 32rpx;
      }

      .icon-shoucang,.icon-shoucang1 {
        font-size: 44rpx;
      }

      text {
        font-size: 24rpx;
      }
    }

  }

  .others{
    width: 680rpx;
    .til {
      width: 680rpx;
      padding: 20rpx 0;
      font-weight: bold;
      font-size: 38rpx;
    }
    .line {
      width: 680rpx;
      height: 2rpx;
      background: #F2F2F2;
      margin-top: 20rpx;
    }
  }
</style>
